<script setup lang="ts">
import rewardCard from '@/components/rewardCard.vue'
import { ref } from 'vue'
import { get } from '@/utils/service'
import { VUE_APP_BASE_API } from '@/utils/baseConfig'
const loading = ref(false)
const finished = ref(false)
const noEmpty = ref(false)
const rewardLists = ref([])
const page = ref(1)
const limit = 5
function onLoad() {
  // 异步更新数据
  // setTimeout 仅做示例，真实场景中一般为 ajax 请求
  get('/corporateCultureWechatNew/queryWechatAgentList', {
    limit: limit,
    page: page.value,
  })
    .then((res) => {
      if (res.code === 0) {
        // 正常返回数据
        loading.value = false
        noEmpty.value = false
        res.data.forEach((item) => {
          rewardLists.value.push({
            ...item,
          })
        })
        page.value++
        console.log(rewardLists.value)
      } else {
        //其他返回数据情况
        if (res.count > 0) {
          //有数据情况
          if (res.code == 201) {
            loading.value = true
            finished.value = true
            noEmpty.value = false
          }
        } else {
          //无数据情况
          loading.value = true
          finished.value = true
          noEmpty.value = true
        }
      }
    })
    .catch((err) => {
      console.log(err)
    })
}
</script>
<template>
  <van-image width="100%" height="auto" :src="VUE_APP_BASE_API + '/images/vue/rewardBanner.jpg'" />
  <van-empty
    v-if="noEmpty == true"
    :image="VUE_APP_BASE_API + '/images/vue/noData.png'"
    image-size="100"
    description="暂无数据"
  />
  <van-list
    v-else
    v-model:loading="loading"
    :finished="finished"
    finished-text="没有更多了"
    @load="onLoad"
  >
    <rewardCard
      v-for="rewardCard in rewardLists"
      v-bind:key="rewardCard.dbid"
      :item="rewardCard"
      :show-tile-state="false"
    ></rewardCard>
    <br />
  </van-list>
  <br />
  <br />
</template>
<style></style>
